<template>
  <h1>计算器练习</h1>
  <input type="text" v-model="a">
  <input type="text" v-model="b"><br>

  <button @click="f('+')">加</button>
  <button @click="f('-')">减</button>
  <button @click="f('*')">乘</button>
  <button @click="f('/')">除</button>
  <h4>结果是:{{res}}</h4>
</template>

<script setup>
import {ref} from "vue";

const a = ref('');
const b = ref('');
const res = ref('');

const f = (o)=>{
  res.value = eval(a.value + o + b.value);
  // let n1 = parseFloat(a.value);
  // let n2 = parseFloat(b.value);
  // if(isNaN(n1) || isNaN(n2)){
  //   alert('请输入数字')
  //   return;
  // }
  // switch (o){
  //   case '+':
  //     res.value = n1 + n2;break;
  //   case '-':
  //     res.value = n1 - n2;break;
  //   case '*':
  //     res.value = n1 * n2;break;
  //   case '/':
  //     res.value = n1 / n2;
  // }
}

</script>


<style scoped>

</style>